<template>
  <el-card class="box-card">
    <el-form inline :model="user" :rules="loginrules" ref="ruleForm" >
      <el-form-item class="car" prop="account">
        <div style="font-size: 20px">账号:</div>
        <div style="margin-left: 20px">
          <el-input
              placeholder="请输入账号"
              v-model="user.account"
              clearable>
          </el-input>
        </div>
      </el-form-item>
      <el-form-item class="car" prop="password">
        <div style="font-size: 20px">新密码:</div>
        <div style="margin-left: 20px">
          <el-input
              placeholder="请输入新密码"
              v-model="user.password"
              show-password>
          </el-input>
        </div>
      </el-form-item>
      <el-form-item class="car" prop="password">
        <div style="font-size: 20px">确认新密码:</div>
        <div style="margin-left: 20px">
          <el-input
              placeholder="请输入新密码"
              v-model="user.pass"
              show-password>
          </el-input>
        </div>
      </el-form-item>
      <div style="margin-left: 5px;margin-top: 15px;text-align: center">
        <el-button style="width: 100px;background: linear-gradient(paleturquoise,royalblue)" type="primary" @click="updatepwd">确认修改</el-button>
      </div>
    </el-form>
  </el-card>
</template>

<script>
export default {
  name: "updatepwd",
  data(){
    return{
      user:{
        password:'',
        account:'',
        pass:'',
      }
    }
  },
  methods:{
    updatepwd(){
      if(this.user.password==this.user.pass){
        this.$axios.post("/api/user/updatepwd", this.user).then(res => {
          console.log(res);

          if (res.data.status === 1) {

            this.$message.success(res.data.msg);
            this.user.account='';
            this.user.password='';
            this.user.pass='';
          }else {
            this.$message.error(res.data.msg);
          }
        });
      }else {
        this.$message.error("两次密码不一致");
      }

    }
  }
}
</script>

<style scoped>
.box-card{
  margin-left:50px;
/*padding-top: 40px;*/
/*  padding-left: 70px;*/
  width: 300px;

}
.car div {
  display: inline-block;
}
</style>